<script setup lang="ts">
import { ref } from "vue";
import Typings from "@plugins/typings";

const activeName = ref("User");

const options = ref<Typings.Common.option[]>([
  { name: "用户", code: "User" },
  { name: "配置", code: "Config" },
]);

const handleClick = (data) => {
  console.log(data);
};
</script>

<template>
  <div class="page-container w-full h-full">
    <xt-row>
      <xt-col>
        <xt-card header="基础">
          {{ activeName }}
          <xt-tabs
            v-model="activeName"
            :options="options"
            @tab-click="handleClick"
          />
          <span v-if="activeName === 'User'">User</span>
          <span v-if="activeName === 'Config'">Config</span>
        </xt-card>
      </xt-col>
    </xt-row>
  </div>
</template>
